<template>
  <a-modal
    :visible="visible4"
    title="作废"
    cancelText="取消"
    okText="确定"
    @ok="submit"
    @cancel="cancel"
  >
    <div class="title">
      确认后订单将自动取消，确认后将不可撤销<br />确认作废？
    </div>
    <!-- <a-image :src="formState.path"></a-image> -->
  </a-modal>
  <!-- <detail :visible="state.visibleDetail" @close="closeDetail" :record="state.recordData"></detail> -->
</template>

<script>
import { defineComponent, reactive, ref, watch } from "vue";
export default defineComponent({
  props: {
    visible4: {
      type: Boolean
    },
    record: {
      type: Object
    }
  },
  emit: ["close"],
  setup(props, context) {
    watch(props, props => {
      formState.id = props.record.id;
      formState.path = props.record.path;
    });

    const formRef = ref();

    const formState = reactive({
      sort: 0,
      enable: "true"
    });

    const cancel = e => {
      context.emit("close", false);
    };

    const submit = e => {
      context.emit("close", false);
    };

    const tokenKey = localStorage.getItem("token_key");
    const token = localStorage.getItem("token");

    const headers = {
      Authorization: token,
      "Authorization-key": tokenKey
    };

    return {
      cancel,
      submit,
      headers,
      formRef,
      formState,
      labelCol: { span: 6 },
      wrapperCol: { span: 18 }
    };
  }
});
</script>
<style lang="less" scoped>
.title {
  color: #000;
  font-weight: 700;
  padding: 40px 10px;
}
</style>
